<template>
    <bi-form >
        <bi-form-item label="数据库">
            <bi-select v-model="config" required style="margin-bottom:10px;" :clear="false">
                <bi-select-option  v-for="item in configList" :key="item.value" :value="item.value" :label="item.label" ></bi-select-option>
            </bi-select>
        </bi-form-item>
        <bi-table :data="tableList" :loading="loading" height="300" checkbox  class="border raduis" @checkboxChange="checkboxChange" >
            <bi-table-column label="模型" name="name" width="200" ></bi-table-column>
            <bi-table-column label="表名" name="table" width="200" ></bi-table-column>
            <bi-table-column label="备注" name="comment"  ></bi-table-column>
        </bi-table>
    </bi-form>
</template>

<script>
export default{
    dialog:{
        width:800,
        title:'同步表结构',
        loading:false,
        okButton:'开始同步'
    },
    data(){
        return {
            configList:[],
            tableList:[],
            checkList:[],
            config:'',
            loading:false
        }
    },
    props:{
        app:String,
        modelList:Array
    },
    watch:{
        config(val){
             this.flashTable(val);
        }
    },
    methods:{
        checkboxChange(list){
            this.checkList = list;
        },
        dialogOk(){
            
            if (this.checkList.length == 0){
                this.$alert('请选择需要同步的表');
                return false;
            }
            this.dialog.loading = true;

            let list = [];

            this.checkList.map(item=>{
                list.push({
                    table:item.table,
                    name:item.name,
                    comment:item.comment
                });
            });
            
            this.$ajax({
                url:this.$url({controller:'database',action:'syncTable'}),
                data:{
                    app:this.app,
                    name:this.config,
                    list
                },
                success:(res)=>{
                    this.dialog.loading = false;
                    this.$toast('同步成功');
                }
            });
            
            return false;
        },
        flashTable(val){
            this.loading = true;
            this.$ajax({
                url:this.$url({controller:'database',action:'tableList'}),
                data:{
                    app:this.app,
                    name:val
                },
                success:(res)=>{
                    
                    let list = [];

                    this.modelList.map(model=>{
                        let table = {
                            name:model.name,
                            table:model.table,
                            comment:model.comment,
                            disabled:true
                        };

                        res.map(item=>{
                            if (item.table==model.table){
                                table.disabled = false;
                                table.comment = item.comment;
                            }
                        });

                        list.push(table);
                    });


                    this.tableList = list;
                    this.loading = false;
                }
            })
        }
    },
    mounted(){
        this.$ajax({
            url:this.$url({controller:'database',action:'configList'}),
            data:{
                app:this.app
            },
            success:(res)=>{
                
                if (res.length>0){
                    this.configList = res;
                
                    res.forEach(element => {
                        if (element.default){
                            this.config = element.value;
                        }
                    });
                }

                this.dialog.loading = false;
            }
        })
    }
}
</script>